<template>
  <div class="app-container">
    <div class="tablists">
      <span
        class="name"
        v-for="(item,index) in grouptabs"
        :class="{active:(indexs==index)}"
        @click="handleTabs(item,index)"
        :key="index"
      >{{item.typeValue}}</span>
    </div>
    <div class="filter_container">
      <el-form :inline="true" :model="groupform" class="demo-form-inline">
        <div style="display: flex;flex-direction: column;">
          <el-form-item label="通用链接:" v-if="indexs=='0'">
            <div class="Universallink" style>
              <span style="margin-right:10px;">{{Universallink.currencyLink}}</span>
              <el-button
                type="info"
                plain
                size="small"
                @click="headerCopy(Universallink.currencyLink)"
              >复制</el-button>
            </div>
          </el-form-item>
          <el-form-item label="内部链接:" v-if="indexs=='0'">
            <div class="Universallink" style>
              <span style="margin-right:10px;">{{Universallink.insideLink}}</span>
              <el-button
                type="info"
                plain
                size="small"
                @click="headerCopy(Universallink.insideLink)"
              >复制</el-button>
            </div>
          </el-form-item>
          <el-form-item label="美团团购:" v-if="indexs=='0'">
            <div class="Universallink" style>
              <span style="margin-right:10px;">{{Universallink.meituanLink}}</span>
              <el-button
                type="info"
                plain
                size="small"
                @click="headerCopy(Universallink.meituanLink)"
              >复制</el-button>
            </div>
          </el-form-item>
          <el-form-item label="支付宝口碑:" v-if="indexs=='0'">
            <div class="Universallink" style>
              <span style="margin-right:10px;">{{Universallink.koubeiLink}}</span>
              <el-button
                type="info"
                plain
                size="small"
                @click="headerCopy(Universallink.koubeiLink)"
              >复制</el-button>
            </div>
          </el-form-item>
          <!-- <el-form-item label v-if="indexs=='1'">
            <div class="Universallink" style>
              <span style="margin-right:10px;">{{Universallink.insideLink}}</span>
              <el-button
                type="info"
                plain
                size="small"
                @click="headerCopy(Universallink.insideLink)"
              >复制</el-button>
            </div>
          </el-form-item>-->
          <el-form-item label="链接名称:">
            <el-input
              v-model.trim="groupform.linkName"
              size="small"
              clearable
              placeholder="请输入链接名称"
              @keyup.enter.native="handleFiltergroup"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              @click="handleFiltergroup"
              icon="el-icon-search"
              size="small"
              plain
            >查询</el-button>
            <el-button
              type="success"
              @click="handleAddgroup(linkType)"
              icon="el-icon-circle-plus-outline"
              plain
              size="small"
            >新建</el-button>
            <el-button
              type="warning"
              @click="handlesetWeChat(linkType)"
              icon="el-icon-setting"
              plain
              size="small"
            >设置微信号</el-button>
          </el-form-item>
        </div>
      </el-form>
    </div>
    <el-table
      :key="tableKey"
      v-loading="listLoading"
      :data="groupList"
      border
      fit
      highlight-current-row
      style="width: 100%;"
    >
      <el-table-column label="图片" align="center" width="120">
        <template slot-scope="{row}">
          <img :src="row.linkHeadPicture" alt class="groupimg" />
        </template>
      </el-table-column>
      <el-table-column label="链接名称" align="center" width="300">
        <template slot-scope="{row}">
          <span>{{ row.linkName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="链接地址" align="center">
        <template slot-scope="{row}">
          <span>{{ row.linkUrl}}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="240">
        <template slot-scope="{row}">
          <el-button type="warning" size="mini" @click="handleDeitgroup(row)">编辑</el-button>
          <el-button type="danger" size="mini" @click="handleDelete(row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="groupform.page"
      :limit.sync="groupform.size"
      @pagination="getList"
    />
    <el-dialog
      :title="textgroup[dialogStatus]"
      :visible.sync="dialogVisible"
      :before-close="handleClose"
      :lock-scroll="true"
      width="55%"
      sytle="height:600px"
    >
      <el-form
        :model="groupForm"
        :rules="groupFormrules"
        ref="groupForm"
        label-width="100px"
        class="demo-ruleForm"
        @click.stop
      >
        <el-form-item label="链接名称" required>
          <el-input v-model.trim="groupForm.linkName" style="width:200px" size="small"></el-input>
        </el-form-item>
        <el-form-item label="蛋糕组成" required style="position:relative">
          <el-input
            v-model="Cakecomposition"
            style="width:200px"
            size="small"
            placeholder="请输入商品名称搜索"
            @input="handleserch(Cakecomposition)"
          ></el-input>
          <div class="grouplist" v-show="goodsListShow" v-if="goodsList&&goodsList.length>0">
            <el-tabs
              :tab-position="tabPosition"
              style="height: 200px;"
              v-if="dialogStatus =='create'"
            >
              <el-tab-pane
                v-for="(item,index) in goodsList"
                :key="index"
                :label="item.goodsName"
                v-if="goodsList&&goodsList.length>0"
              >
                <p
                  v-for="(child,index2) in item.list"
                  :key="index2"
                  @click="handleGoodsList(item.goodsName,child.specs,child.skuId)"
                  v-if="item.list"
                >{{child.specs}}</p>
              </el-tab-pane>
            </el-tabs>
            <el-tabs
              :tab-position="tabPosition"
              style="height: 200px;"
              v-if="dialogStatus =='update'"
            >
              <el-tab-pane
                v-for="(item,index) in goodsList"
                :key="index"
                :label="item.goodsName"
                v-if="goodsList&&goodsList.length>0"
              >
                <p
                  v-for="(child,index2) in item.list"
                  :key="index2"
                  @click="handleGoodsListUpdate(item.goodsName,child.specs,child.skuId)"
                  v-if="item.list"
                >{{child.specs}}</p>
              </el-tab-pane>
            </el-tabs>
            <div class="close">
              <i class="el-icon-error Delgoodlist" @click="headleclose"></i>
            </div>
          </div>
          <div class="grouplist nodata" v-show="goodsListShow" v-else>
            <p>
              <img :src="groupnodataimg" alt />暂无数据
              <span>(请搜索其他蛋糕)</span>
            </p>
          </div>
        </el-form-item>
        <div class="goodsListmain" v-if="dialogStatus =='create'">
          <div class="goodsListadd" v-for="(item,index) in groupForm.list" :key="index">
            <div class="left">
              <div class="skucodes">
                <span>{{item.skuCode}}({{item.specs}})</span>
                <br />
              </div>
              <el-input
                type="textarea"
                autosize
                v-model="item.name"
                placeholder="营销名称"
                maxlength="50"
                show-word-limit
              ></el-input>
            </div>
            <div class="right">
              <el-upload
                list-type="picture-card"
                :data="{tag:'groupbuy'}"
                action="/api/xmbz-goods/file/upload"
                :show-file-list="false"
                :on-success="(res,file)=>{return handleAvatarSuccess(res,file, item)}"
                :on-change="(res,file)=>{return handleHeadChange(res,file, item)}"
                :on-preview="handlePictureCardPreview"
                :on-remove="handleRemove"
              >
                <img v-if="item.mainPic&&item.mainPic.length" :src="item.mainPic" class="avatar" />
                <i v-else class="el-icon-plus"></i>
              </el-upload>
              <i class="el-icon-error Delgoodlist" @click="handleDelgoodlist(index)"></i>
            </div>
          </div>
        </div>
        <div class="goodsListmain" v-if="dialogStatus =='update'">
          <div class="goodsListadd" v-for="(item,index) in groupForm.list" :key="index">
            <div class="left">
              <div class="skucodes">
                <span>{{item.skuName}}</span>
                <br />
              </div>
              <el-input
                type="textarea"
                autosize
                v-model.trim="item.marketName"
                placeholder="营销名称"
                maxlength="50"
                show-word-limit
              ></el-input>
            </div>
            <div class="right">
              <el-upload
                list-type="picture-card"
                action="/api/xmbz-goods/file/upload"
                :show-file-list="false"
                :data="{tag:'groupbuy'}"
                :on-success="(res,file)=>{return handleAvatarSuccessUpdate(res,file, item)}"
                :on-change="(res,file)=>{return handleHeadChange(res,file, item)}"
                :on-preview="handlePictureCardPreview"
                :on-remove="handleRemove"
              >
                <img v-if="item.imageUrl&&item.imageUrl.length" :src="item.imageUrl" class="avatar" />
                <i v-else class="el-icon-plus"></i>
              </el-upload>
              <i class="el-icon-error Delgoodlist" @click="handleDelgoodlistupdate(index)"></i>
            </div>
          </div>
        </div>

        <div class="flexrows">
          <el-form-item label="链接有效期" required>
            <el-date-picker
              v-model="groupForm.startTime"
              type="datetime"
              placeholder="选择时间"
              size="small"
              style="width: 180px;margin-right:10px"
            ></el-date-picker>
            <el-date-picker
              v-model="groupForm.endTime"
              type="datetime"
              size="small"
              placeholder="选择时间"
              style="width: 180px"
            ></el-date-picker>
          </el-form-item>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="headleCanle">取 消</el-button>
        <el-button
          type="primary"
          @click="dialogStatus==='create'?createData(groupForm,'groupForm'):updateData(groupForm,'groupForm')"
        >确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="设置微信号"
      :visible.sync="setweixinVisible"
      width="30%"
      :before-close="handleClose"
    >
      <el-form :model="setweixinform">
        <el-form-item label="微信号">
          <el-input
            v-model.trim="setweixinform.WeChat"
            autocomplete="off"
            type="textarea"
            maxlength="20"
            show-word-limit
            placeholder="请输入微信号"
          ></el-input>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="setweixinVisible = false">取 消</el-button>
        <el-button type="primary" @click="handlesetweixinform">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import Pagination from "@/components/Pagination"; //分页
import groupnodataimg from "@/assets/image/groupnodata.png";
import {
  getLinkType,
  getqueryPage, //列表
  getCurrencyLink,
  deleteById,
  getNameAndSpecsByName,
  LinksaveOrUpdate,
  getgroupDetails, // 链接详情
  setWxNumber,
  getWxNumber,
} from "@/api/commodityfiles";
export default {
  components: {
    Pagination,
  },
  data() {
    return {
      groupnodataimg,
      indexs: 0, // tab索引
      grouptabs: [
        //标签数据
      ],
      groupform: {
        linkType: "1",
        linkName: "",
        page: 1,
        size: 10,
      },
      groupList: [], //链接列表数据
      tableKey: 0,
      total: 0,
      listLoading: false,
      //新建及编辑
      textgroup: {
        update: "修改团购信息",
        create: "添加团购信息",
      },
      Universallink: "",
      dialogStatus: "",
      dialogVisible: false,
      Cakecomposition: "",
      linkType: 1,
      groupForm: {
        linkName: "",
        linkType: "",
        startTime: "",
        endTime: "",
        list: [],
      },
      groupFormrules: {
        linkName: [
          {
            required: true,
            message: "请输入链接名称",
            trigger: "blur",
          },
        ],
        Cakecomposition: [
          {
            required: true,
            message: "请选择蛋糕组成",
            trigger: "blur",
          },
        ],
        startTime: [
          {
            type: "date",
            required: true,
            message: "请选择链接有效期开始时间",
            trigger: "change",
          },
        ],
        endTime: [
          {
            type: "date",
            required: true,
            message: "请选择链接有效期结束时间",
            trigger: "change",
          },
        ],
      },
      goodsList: [], //蛋糕组成
      tabPosition: "left",
      goodsListShow: false,
      goodsListgroup: [],
      goodsListgroupupdate: [],
      setweixinVisible: false,
      setweixinform: {
        WeChat: "",
      },
    };
  },
  watch: {
    dialogVisible() {
      if (this.dialogVisible == true) {
        window.removeEventListener("keydown", this.keyupEnter);
      } else {
        window.addEventListener("keydown", this.keyupEnter);
      }
    },
  },
  mounted() {
    var saberareaIds = JSON.parse(localStorage.getItem("saber-areaId"));
    this.cityareaId = saberareaIds["content"];
    this.getLinkTypeList();
    this.getList();
    this.getCurrencyLinkData();
    window.addEventListener("keydown", this.keyupEnter);
  },
  destroyed() {
    window.removeEventListener("keydown", this.keyDown, false);
  },
  methods: {
    // 回车事件
    keyupEnter() {
      if (window.event.keyCode == 13) {
        this.handleFiltergroup(); // 查询事件
      }
    },
    //如果页面有keep-alive缓存功能，这个函数会触发
    activated() {
      window.addEventListener("keydown", this.keyupEnter);
    },
    deactivated() {
      window.removeEventListener("keydown", this.keyupEnter);
    },
    // 切换tabs
    handleTabs(item, index) {
      this.indexs = index;
      this.groupform.linkType = item.type;
      this.linkType = item.type;
      this.getList();
    },
    getCurrencyLinkData() {
      getCurrencyLink().then((response) => {
        this.Universallink = response.data.data;
      });
    },
    getLinkTypeList() {
      getLinkType().then((response) => {
        this.grouptabs = response.data.data;
      });
    },
    headleclose() {
      this.goodsListShow = false;
    },
    getList() {
      //列表数据
      this.listLoading = false;
      getqueryPage(this.groupform).then((response) => {
        this.groupList = response.data.data.rows;
        this.total = response.data.data.total;
        setTimeout(() => {
          this.listLoading = false;
        }, 1.5 * 1000);
      });
    },

    handleFiltergroup() {
      this.groupform.page = 1;
      this.getList();
      //查询
    },
    handleAddgroup(type) {
      //新建团购
      this.linkType = type;
      this.dialogVisible = true;
      this.dialogStatus = "create";
      this.Cakecomposition = "";
      this.groupForm = {
        linkName: "",
        linkType: "",
        startTime: "",
        endTime: "",
        list: [],
      };
    },
    handleserch(name) {
      getNameAndSpecsByName({
        deptId: this.cityareaId,
        name: name,
      }).then((response) => {
        this.goodsList = response.data.data;
        if (this.goodsList && this.goodsList.length) {
          this.goodsListShow = true;
        }
      });
    },
    handleDeitgroup(row) {
      //编辑团购
      this.dialogVisible = true;
      this.dialogStatus = "update";
      getgroupDetails({
        id: row.id,
      }).then((response) => {
        this.groupForm.linkName = response.data.data.linkName;
        this.groupForm.startTime = response.data.data.startTime;
        this.groupForm.endTime = response.data.data.endTime;
        this.groupForm.list = response.data.data.list;
        this.groupForm.id = response.data.data.id;
      });
    },
    headleCanle() {
      this.dialogVisible = false;
    },
    handleGoodsList(name, specs, skuId) {
      //添加蛋糕组成
      if (this.groupForm.list.length <= 10) {
        if (this.linkType == "1") {
          if (this.groupForm.list.length >= 1) {
            this.$message({
              message: "该团购为单品，只能添加一组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        if (this.linkType == "2") {
          if (this.groupForm.list.length >= 2) {
            this.$message({
              message: "该团购为二选一，只能添加两组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        if (this.linkType == "3") {
          if (this.groupForm.list.length >= 3) {
            this.$message({
              message: "该团购为三选一，只能添加三组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        if (this.linkType == "4") {
          if (this.groupForm.list.length >= 4) {
            this.$message({
              message: "该团购为四选一，只能添加四组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        if (this.linkType == "5") {
          if (this.groupForm.list.length >= 5) {
            this.$message({
              message: "该团购为五选一，只能添加五组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        if (this.linkType == "6") {
          if (this.groupForm.list.length >= 2) {
            this.$message({
              message: "该团购为买一送一，只能添加2组商品",
              type: "warning",
            });
            this.goodsListShow = false;
            return false;
          }
        }
        this.groupForm.list.push({
          skuCode: name,
          specs: specs,
          name: "",
          mainPic: "",
          skuId: skuId,
        });
        this.goodsListShow = false;
      }
    },
    handleGoodsListUpdate(name, specs, skuId) {
      if (this.linkType == "1") {
        if (this.groupForm.list.length >= 1) {
          this.$message({
            message: "该团购为单品，只能添加一组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      if (this.linkType == "2") {
        if (this.groupForm.list.length >= 2) {
          this.$message({
            message: "该团购为二选一，只能添加两组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      if (this.linkType == "3") {
        if (this.groupForm.list.length >= 3) {
          this.$message({
            message: "该团购为三选一，只能添加三组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      if (this.linkType == "4") {
        if (this.groupForm.list.length >= 4) {
          this.$message({
            message: "该团购为四选一，只能添加四组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      if (this.linkType == "5") {
        if (this.groupForm.list.length >= 5) {
          this.$message({
            message: "该团购为五选一，只能添加五组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      if (this.linkType == "6") {
        if (this.groupForm.list.length >= 2) {
          this.$message({
            message: "该团购为买一送一，只能添加2组商品",
            type: "warning",
          });
          this.goodsListShow = false;
          return false;
        }
      }
      this.groupForm.list.push({
        skuName: name + "~" + specs,
        marketName: "",
        imageUrl: "",
        skuId: skuId,
      });
      this.goodsListShow = false;
    },
    handleDelgoodlistupdate(index) {
      this.$confirm("此操作将永久删除该蛋糕组成, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.groupForm.list.splice(index, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    handleDelgoodlist(index) {
      //删除蛋糕组成
      this.$confirm("此操作将永久删除该蛋糕组成, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.groupForm.list.splice(index, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },

    handleDelete(row) {
      //删除
      this.$confirm("此操作将删除该条列表数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          deleteById({
            id: row.id,
          }).then(() => {
            this.$message({
              type: "success",
              message: "删除成功!",
            });
            this.getList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    createData(items, verification) {
      // this.$refs[verification].validate(valid => {
      // if (valid) {
      if (items.linkName == "") {
        this.$message({
          message: "链接名称必填",
          type: "warning",
        });
        return false;
      }

      if (this.linkType == "1") {
        if (items.list.length != 1) {
          this.$message({
            message: "该团购为单品，需要添加一组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (this.linkType == "2") {
        if (items.list.length != 2) {
          this.$message({
            message: "该团购为二选一，需要添加二组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (this.linkType == "3") {
        if (items.list.length != 3) {
          this.$message({
            message: "该团购为三选一，需要添加三组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (this.linkType == "4") {
        if (items.list.length != 4) {
          this.$message({
            message: "该团购为四选一，需要添加四组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (this.linkType == "5") {
        if (items.list.length != 5) {
          this.$message({
            message: "该团购为五选一，需要添加五组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (this.linkType == "6") {
        if (items.list.length != 2) {
          this.$message({
            message: "该团购为买一送一，需要添加二组商品",
            type: "warning",
          });
          return false;
        }
      }
      if (items.list && items.list.length) {
        const marketName = items.list.every((items) => {
          return items.name;
        });
        const imgUrl = items.list.every((items) => items.mainPic);
        if (!marketName) {
          this.$message({
            message: "营销名称必填",
            type: "warning",
          });
          return false;
        } else if (!imgUrl) {
          this.$message({
            message: "营销图片必传",
            type: "warning",
          });
          return false;
        }
      }
      if (this.groupForm.startTime == "") {
        this.$message({
          message: "请选择链接开始时间",
          type: "warning",
        });
        return false;
      }
      if (this.groupForm.endTime == "") {
        this.$message({
          message: "请选择链接结束时间",
          type: "warning",
        });
        return false;
      }
      let startTime = "",
        endTime = "";
      startTime = this.dayjs(items.startTime)
        .format("YYYY-MM-DD HH:mm:ss")
        .toString();
      endTime = this.dayjs(items.endTime)
        .format("YYYY-MM-DD HH:mm:ss")
        .toString();

      if (endTime <= startTime) {
        this.$message({
          showClose: true,
          message: "结束时间要大于开始时间 ",
          type: "warning",
        });
        return false;
      }

      const goodsListgroup = [];
      items.list.map((child) => {
        goodsListgroup.push({
          skuId: child.skuId,
          marketName: child.name,
          imgUrl: child.mainPic,
        });
      });
      const groupFormData = {
        linkType: this.linkType,
        startTime: this.dayjs(items.startTime)
          .format("YYYY-MM-DD HH:mm:ss")
          .toString(),
        endTime: this.dayjs(items.endTime)
          .format("YYYY-MM-DD HH:mm:ss")
          .toString(),
        list: goodsListgroup,
        linkName: items.linkName,
      };
      LinksaveOrUpdate(groupFormData).then(() => {
        this.$notify({
          title: "添加商品",
          message: "添加商品成功",
          type: "success",
          duration: 2000,
        });
        this.getList();
        this.$refs[verification].resetFields();
        this.dialogVisible = false;
      });
    },
    updateData(items, verification) {
      this.$refs[verification].validate((valid) => {
        if (valid) {
          if (items.linkName == "") {
            this.$message({
              message: "链接名称必填",
              type: "warning",
            });
            return false;
          }

          if (items.startTime == "Invalid Date" || items.startTime == null) {
            this.$message({
              message: "请选择链接开始时间",
              type: "warning",
            });
            return false;
          }
          if (items.endTime === "Invalid Date" || items.endTime == null) {
            this.$message({
              message: "请选择链接结束时间",
              type: "warning",
            });
            return false;
          }
          if (this.linkType == "1") {
            if (items.list.length != 1) {
              this.$message({
                message: "该团购为单品，需要添加一组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (this.linkType == "2") {
            if (items.list.length != 2) {
              this.$message({
                message: "该团购为二选一，需要添加二组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (this.linkType == "3") {
            if (items.list.length != 3) {
              this.$message({
                message: "该团购为三选一，需要添加三组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (this.linkType == "4") {
            if (items.list.length != 4) {
              this.$message({
                message: "该团购为四选一，需要添加四组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (this.linkType == "5") {
            if (items.list.length != 5) {
              this.$message({
                message: "该团购为五选一，需要添加五组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (this.linkType == "6") {
            if (items.list.length != 2) {
              this.$message({
                message: "该团购为买一送一，需要添加二组商品",
                type: "warning",
              });
              return false;
            }
          }
          if (items.list && items.list.length) {
            const marketName = items.list.every((items) => {
              return items.marketName;
            });
            const imgUrl = items.list.every((items) => items.imageUrl);
            if (!marketName) {
              this.$message({
                message: "营销名称必填",
                type: "warning",
              });
              return false;
            } else if (!imgUrl) {
              this.$message({
                message: "营销图片必传",
                type: "warning",
              });
              return false;
            }
            let startTime = "",
              endTime = "";
            startTime = this.dayjs(items.startTime)
              .format("YYYY-MM-DD HH:mm:ss")
              .toString();
            endTime = this.dayjs(items.endTime)
              .format("YYYY-MM-DD HH:mm:ss")
              .toString();
            if (endTime <= startTime) {
              this.$message({
                showClose: true,
                message: "结束时间要大于开始时间 ",
                type: "warning",
              });
              return false;
            }

            var piclist = [];
            items.list.map((child) => {
              piclist.push({
                skuId: child.skuId,
                marketName: child.marketName,
                imgUrl: child.imageUrl,
              });
            });
          }

          const groupFormupdateData = {
            id: items.id,
            linkType: this.linkType,
            startTime: this.dayjs(items.startTime)
              .format("YYYY-MM-DD HH:mm:ss")
              .toString(),
            endTime: this.dayjs(items.endTime)
              .format("YYYY-MM-DD HH:mm:ss")
              .toString(),
            list: piclist,
            linkName: items.linkName,
          };
          LinksaveOrUpdate(groupFormupdateData).then(() => {
            this.$notify({
              title: "修改商品",
              message: "添加商品成功",
              type: "success",
              duration: 2000,
            });
            this.getList();
            this.dialogVisible = false;
          });
        } else {
          // console.log("error submit!!");
          return false;
        }
      });
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then(() => {
          done();
          this.goodsListShow = false;
          this.dialogVisible = false;
        })
        .catch(() => {});
    },
    // 图片上传
    // 图片预览及删除
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    // 单个主图开始上传
    handleAvatarSuccess(response, file, item) {
      item.mainPic = response.data;
    },
    handleAvatarSuccessUpdate(response, file, item) {
      item.imageUrl = response.data;
    },
    handleHeadChange() {},
    headerCopy(link) {
      this.copy(link);
    },
    copy(data) {
      let url = data;
      let oInput = document.createElement("input");
      oInput.value = url;
      document.body.appendChild(oInput);
      oInput.select(); // 选择对象;
      console.log(oInput.value);
      document.execCommand("Copy"); // 执行浏览器复制命令
      this.$message({
        message: "复制成功",
        type: "success",
      });
      oInput.remove();
    },
    //设置微信号
    handlesetWeChat(item) {
      this.setweixinVisible = true;
      getWxNumber().then((res)=>{
this.setweixinform.WeChat=res.data.data.dictValue
      })
    },
    handlesetweixinform() {
      if (this.setweixinform.WeChat == "") {
        this.$message({
          message: "请输入微信号",
          type: "warning",
        });
      } else {
        const wxNumber={
          dictValue: this.setweixinform.WeChat
        }
        setWxNumber(wxNumber).then((res) => {
          console.log(res);
          this.$message({
            message: "修改微信号成功",
            type: "success",
          });
        });

        this.setweixinVisible = false;
      }
    },
  },
};
</script>


<style lang='scss'>
.app-container {
  padding: 20px;
  width: 100%;
  box-sizing: border-box;

  .tablists {
    display: flex;
    margin-bottom: 10px;

    .name {
      padding: 0 18px;
      text-align: center;
      color: #000;
      font-size: 20px;
      line-height: 38px;
      cursor: pointer;

      &.active {
        font-size: 18px;
        color: #fff !important;
        background: rgba(24, 144, 255, 1);
        border-radius: 4px;
      }
    }
  }

  .filter_container {
    display: flex;
    justify-content: space-between;

    .demo-form-inline {
      width: 100%;
      display: flex;
      justify-content: space-between;
    }

    .Universallink {
      margin-right: 20px;
    }
  }

  .groupimg {
    width: 85px;
    height: 85px;
  }
}

.grouplist {
  border: 1px solid #e4e7ed;
  border-radius: 4px;
  background-color: #fff;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  margin: 5px 0;
  position: absolute;
  width: 100%;
  z-index: 999;

  .el-tabs__item {
    padding: 0 10px！important;
  }

  .close {
    position: absolute;
    top: 0;
    right: 0;
  }

  .el-tabs__item.is-active {
    color: #fff;
    background: #409eff;
    text-align: center !important;
  }

  .el-tabs--left .el-tabs__header.is-left {
    width: 55% !important;
  }

  .el-tabs--left .el-tabs__item.is-left {
    text-align: center !important;
  }

  el-tabs__nav-wrap::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    z-index: 1;
  }

  &.nodata {
    text-align: center;

    img {
      width: 80px;
      display: block;
      margin: auto;
    }

    span {
      font-size: 12px;
    }
  }
}

.flexrows {
  display: flex;

  .endtime {
    .el-form-item__content {
      margin-left: 0 !important;
    }
  }
}

.goodsListmain {
  padding: 0 30px 0 65px;
  box-sizing: border-box;

  .goodsListadd {
    border: 1px dashed rgba(211, 211, 211, 1);
    padding: 10px 22px;
    box-sizing: border-box;
    justify-content: space-between;
    display: flex;
    position: relative;
    margin-bottom: 20px;

    .el-input {
      margin-top: 10px;
    }

    .left {
      width: 80%;

      .skucodes {
        padding: 8px;
        border-radius: 6px;
        border: 1px solid #108ee9;
        color: #108ee9;
        margin-bottom: 8px;
      }
    }

    .right {
      width: 15%;

      .el-upload--picture-card {
        width: 80px !important;
        height: 80px !important;
        line-height: 80px !important;
      }

      .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
      }

      .avatar-uploader .el-upload:hover {
        border-color: #409eff;
      }

      .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 80px;
        height: 80px;
        line-height: 80px;
        text-align: center;
      }

      .avatar {
        width: 80px;
        height: 80px;
        display: block;
      }

      .Delgoodlist {
        position: absolute;
        position: absolute;
        top: -15px;
        right: -15px;
        font-size: 34px;
      }
    }
  }
}
</style>
